<script>
export default {
  created () {
    // 调用API从本地缓存中获取数据
    /*
     * 平台 api 差异的处理方式:  api 方法统一挂载到 mpvue 名称空间, 平台判断通过 mpvuePlatform 特征字符串
     * 微信：mpvue === wx, mpvuePlatform === 'wx'
     * 头条：mpvue === tt, mpvuePlatform === 'tt'
     * 百度：mpvue === swan, mpvuePlatform === 'swan'
     * 支付宝(蚂蚁)：mpvue === my, mpvuePlatform === 'my'
     */
  }
}
</script>

<style lang="scss">
.container {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 200rpx 0;
  box-sizing: border-box;
}
/* this rule will be remove */
* {
  transition: width 2s;
  -moz-transition: width 2s;
  -webkit-transition: width 2s;
  -o-transition: width 2s;
}
.bottom12 {
  margin-bottom: 24rpx;
}
.span-link {
  font-size: 28rpx;
  color: #1890ff;
  float: right;
}
.title {
  width: 100%;
  font-size: 36rpx;
  font-weight: bold;
  &::before {
      display: inline-block;
      content: "";
      width: 8rpx;
      height: 36rpx;
      background: #72B0F7;
      border-radius: 4rpx;
      margin-right: 16rpx;
      vertical-align: middle;
      margin-top: -4rpx;
  }
}
.nav-search {
  position: sticky;
  height: 108rpx;
  z-index: 50;
  background: #fff;
  .search-btn {
    padding: 0 24rpx;
  }
}
</style>
